import * as d3 from "d3"
class D3Drawer {
  constructor(svgSelector) {
    this.svg = d3.select(svgSelector);
  }

  drawPoint(coordinates, radius = 5, color = "black") {
    this.svg.append("circle")
      .attr("cx", coordinates[0])
      .attr("cy", coordinates[1])
      .attr("r", radius)
      .attr("fill", color);
  }
  drawPath(color = "blue", tempArr) {
    this.svg.append("path").attr("fill", "none").attr("stroke-width", "2").attr("stroke", color).attr("d", `M${tempArr}`, )
  }

  //   画线
  drawLine(startCoordinates, endCoordinates, color = "red", strokeWidth = 1, strokeDasharray = []) {
    this.svg.append("line")
      .attr("x1", startCoordinates[0])
      .attr("y1", startCoordinates[1])
      .attr("x2", endCoordinates[0])
      .attr("y2", endCoordinates[1]).attr("stroke-dasharray", strokeDasharray)
      .style("stroke", color)
      .style("stroke-width", strokeWidth);
  }

  drawIcon(coordinates, icon, fontSize = "12px", color = "black") {
    this.svg.append("text")
      .attr("x", coordinates[0])
      .attr("y", coordinates[1])
      .text(icon)
      .attr("font-family", "FontAwesome") // 修改为你的图标字体
      .attr("font-size", fontSize)
      .attr("fill", color);
  }

  drawText(coordinates, text, fontSize = "12px", color = "red", writingmode = '', textAlign = "") {
    this.svg.append("text")
      .attr("x", coordinates[0])
      .attr("y", coordinates[1])
      .text(text)
      .attr("font-size", fontSize)
      .attr("fill", color).style("writing-mode", writingmode).attr("text-anchor", textAlign);
  }
  // 正方形
  drawRect(coordinates, endCoordinates, id, color = "red", strokeWidth = 1, stroke = '', opacity = 1) {
    this.svg.append("rect")
      .attr("width", coordinates[0])
      .attr("height", coordinates[1])
      .attr("x", endCoordinates[0])
      .attr("y", endCoordinates[1])
      .attr("stroke-width", strokeWidth)
      .attr("stroke", stroke)
      .attr("fill", color)
      .attr("opacity", opacity)
  }
  drawRemove(id) {
    this.svg.select(id).remove()
  }
  drawCreate_g(id){
    this.svg.append("g").attr("id",id)
  }
}

export default D3Drawer
